<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>表单标签</title>
    <style>
        body {
            background: url("../img/bg.png");
        }

        .center {
            text-align: center;
            background: white;
            width: 400px;
            margin: auto;
        }
    </style>
</head>
<body>
<div>
    <img src="../img/logo.png">
</div>
<div class="center">
    <div>注册详情</div>
    <hr>
    <div>
        <form action="#" method="get" autocomplete="off">
            <div>
                <label type="usename">姓名</label>
                <input type="text" id="usename" name="usename" value="" placeholder="请输入姓名" required/>
            </div>
            <div>
                <label type="password">密码</label>
                <input type="password" id="password" name="password" value="" placeholder="请输入密码" required/>
            </div>
            <div>
                <label type="email">邮箱</label>
                <input type="email" id="email" name="email" value="" placeholder="请输入邮箱" required/>
            </div>
            <div>
                <label type="tel">手机</label>
                <input type="tel" id="tel" name="tel" value="" placeholder="请输入手机号码" required/>
            </div>
            <hr>

            <div>
                <label type="sex">性别</label>
                <input type="radio" id="sex" name="sex" value="man">男
                <input type="radio" name="sex" value="woman">女
            </div>
            <div>
                <label type="ah">爱好</label>
                <input type="checkbox" id="ah" name="ah" value="music">音乐
                <input type="checkbox" name="ah" value="movie">电影
                <input type="checkbox" name="ah" value="game">游戏
            </div>
            <div>
                <label type="date">出生日期</label>
                <input type="date" id="date" name="date" value="date">
            </div>
            <div>
                <label type="city">所在城市</label>
                    <select id="city">
                        <option>请选择您的城市</option>
                        <optgroup label="直辖市">
                            <option>北京</option>
                            <option>上海</option>
                        </optgroup>
                        <optgroup label="省市">
                            <option>武汉</option>
                            <option>济南</option>
                        </optgroup>
                    </select>
            </div>
            <hr>
            <div>
                <button type="reset">提交</button>
                <button type="reset">重置</button>
            </div>
        </form>
    </div>
</div>
</body>
</html>